<section class="headerwrap ">
        <header>
            <div class=" header">
                <div class="top">
                    <div class="wp">
                        <div class="fl">
                            <p>服务电话：<b>33333333</b></p>
                        </div>
                        <!--登录后跳转-->
                        {% if request.user.is_authenticated %}
                            <div class="personal">
                                <dl class="user fr">
                                    <dd>{{ user.username }}<img class="down fr" src="/static/images/top_down.png" /></dd>
                                    <dt><img width="20" height="20" src="{{ MEDIA_URL }}{{ request.user.image }}" /></dt>
                                </dl>
                                <div class="userdetail">
                                    <dl>
                                        <dt><img width="80" height="80" src="{{ MEDIA_URL }}{{ request.user.image }}" /></dt>
                                        <dd>
                                            <h2>{{ request.user.nick_name }}</h2>
                                            <p>{{ request.user.username }}</p>
                                            <p>{{ request.user.id }}</p>
                                        </dd>
                                    </dl>
                                    <div class="btn">
                                        <a class="personcenter fl" href="{% url 'user:usercenter_info' %}">进入个人中心</a>
                                        <a class="fr" href="/logout/">退出</a>
                                    </div>
                                </div>
                            </div>  
                            {% else %}
                            <a style="color:white" class="fr registerbtn" href="{% url 'register' %}">注册</a>
                            <a style="color:white" class="fr loginbtn" href="{% url 'login' %}">登录</a>                   
                        {% endif %}
                    </div>
                </div>
                <div class="middle">
                    <div class="wp">
                        <a href="/"><img class="fl" src="/static/images/logo.jpg" /></a>
                        <div class="searchbox fr">
                            <div class="selectContainer fl">
                                <span class="selectOption" id="jsSelectOption" data-value="course">
                                    公开课
                                </span>
                                <ul class="selectMenu" id="jsSelectMenu">
                                    <li data-value="course">公开课</li>
                                    <li data-value="org">课程机构</li>
                                    <li data-value="teacher">授课老师</li>
                                </ul>
                            </div>
                            <input id="search_keywords" class="fl" type="text" value="" placeholder="请输入搜索内容" />
                            <img class="search_btn fr" id="jsSearchBtn" src="/static/images/search_btn.png" />
                        </div>
                    </div>
                </div>
                <nav>
                    <div class="nav">
                        <div class="wp">
                            <ul>
                                <li {% if request.path == '/' %}class="active" {% endif %}><a href="/">首页</a></li>
                                <li {% if request.path|slice:'7' == '/course' %}class="active"{% endif %}>
                                    <a href="{% url 'course:course_list' %}">
                                        公开课<img class="hot" src="/static/images/nav_hot.png">
                                    </a>
                                </li>
                                <li {% if request.path|slice:'12' == '/org/teacher' %}class="active"{% endif %}>
                                    <a href="{% url 'org:teacher_list' %}">授课教师</a>
                                </li>
                                <li {% if request.path|slice:'9' == '/org/list' %}class="active"{% endif %}><a href="{% url 'org:org_list' %}">授课机构</a></li>
                            </ul>
                        </div>
                    </div>
                </nav>
            </div>
        </header>
    </section>